//
//  TabBarView.swift
//  CustomTabbar
//
//  Created by chenxihang on 2024/8/18.
//

import SwiftUI

// 自定义tabbar
struct TabBarView: View {
    @StateObject var viewRouter = ViewRouter()
    
    var body: some View {
        GeometryReader(content: { geometry in
            NavigationView(content: {
                VStack {
                    // 内容区
                    HStack {
                        switch viewRouter.currentPage {
                        case .home:
                            HomeView()
                        case .find:
                            FindView()
                        case .mine:
                            MineView()
                        }
                    }
                    .frame(width: geometry.size.width, height: geometry.size.height - 80)
                    .background(.green)
                    
                    Spacer()
                    
                    // tabbar区
                    HStack(content: {
                        TabBarItem(viewRouter: viewRouter,
                                   page: .home,
                                   width: geometry.size.width/5,
                                   height: geometry.size.height/32,
                                   icon: "chart.pie.fill",
                                   text: "首页")
                            .frame(maxWidth: /*@START_MENU_TOKEN@*/.infinity/*@END_MENU_TOKEN@*/)
                        
                        TabBarItem(viewRouter: viewRouter,
                                   page: .find,
                                   width: geometry.size.width/5,
                                   height: geometry.size.height/32,
                                   icon: "pencil.circle",
                                   text: "发现")
                            .frame(maxWidth: /*@START_MENU_TOKEN@*/.infinity/*@END_MENU_TOKEN@*/)

                        TabBarItem(viewRouter: viewRouter,
                                   page: .mine,
                                   width: geometry.size.width/5,
                                   height: geometry.size.height/32,
                                   icon: "person.crop.circle.fill",
                                   text: "我的")
                            .frame(maxWidth: /*@START_MENU_TOKEN@*/.infinity/*@END_MENU_TOKEN@*/)

                    })
                    .frame(width: geometry.size.width, height: 80)
                    .padding(.bottom, 0)
                    .background(.white)
                }
            })
        })
        .ignoresSafeArea(edges: .bottom)
        .background(.yellow)
    }
}

#Preview {
    TabBarView()
}
